<script setup lang="ts">
import { onMounted, ref } from 'vue';
import HMI from './views/hmi/index.vue';
import { createWs } from './hooks/common/ws.hook';
import { playAudio } from './hooks/common/audio.hook';
import { emitter } from '@/utils/mitt';
import { NavacationAction, eventNavagation, NavagationAutoEventID } from '@/hooks/business/eventListen/navagationEventListen';
import { eventMap, MapAction, MapWidget } from "@/hooks/business/eventListen/mapEventListen";
import { MusicWidget, eventMusic, MusicAction } from "@/hooks/business/eventListen/musicEventListen";
import { eventVoice, VoiceAction, VoiceEventKey } from './hooks/business/eventListen/voiceEventListen';


onMounted(() => {
  function setRootFontSize() {
    // 设计稿宽度
    const designWidth = 1521;
    // 设计稿基准字体大小
    const baseFontSize = 9;
    const currentWidth = window.innerWidth;
    const scale = currentWidth / designWidth;
    // 计算当前的根字体大小
    const currentFontSize = baseFontSize * scale;
    document.documentElement.style.fontSize = currentFontSize + 'px';
  }

  // 初始化时设置一次
  setRootFontSize();

  // 监听窗口大小变化事件
  window.addEventListener('resize', setRootFontSize);
})

// 键盘esc关闭程序
document.addEventListener('keydown', function (event) {
  if (event.key === 'Escape' || event.keyCode === 27) {
    window.electron.closeWindow();
  }
});

const themeOverrides = {
  common: {
    primaryColorHover: '1px solid #1677FF',
    primaryColor: '#1677FF',
    primaryColorPressed: '#1677FF',
    borderRadius: '10px',
    heightLarge: '5rem',
    fontSizeLarge: '2.4rem',
    inputColor: "#49525A",
    textColor2: "white",
    hoverColor: "#8C949B",
    popoverColor: "#49525A"
  }
}
const audioData = ref("")
let timer: NodeJS.Timeout | null = null;
function setAudioText(text: string) {
  audioData.value = text;
  if (timer) {
    clearTimeout(timer);
    timer = null;
  }
  timer = setTimeout(() => {
    audioData.value = "";
    timer = null;
  }, 3000);
}

createWs("ws://127.0.0.1:5000", (data: string) => {
  setAudioText(data);
  if (data.includes("小美")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    playAudio("mp3/xiaomei-wolaile.mp3")
  }
  if (data.includes("回家")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    eventNavagation(NavacationAction.Auto, null, NavagationAutoEventID.NavagationAutoMap);
    eventMap(MapAction.Auto, null, `Navagation`, null, 'home');
    emitter.emit("pushUrl", "map")
    emitter.emit("goHome")
  }
  if (data.includes("公司")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    eventNavagation(NavacationAction.Auto, null, NavagationAutoEventID.NavagationAutoMap);
    eventMap(MapAction.Auto, null, `Navagation`, null, 'company');
    emitter.emit("pushUrl", "map")
    emitter.emit("goCompany")
  }

  if (data.includes("停止导航")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    eventNavagation(NavacationAction.Auto, null, NavagationAutoEventID.NavagationAutoMap);
    eventMap(MapAction.Auto, null, MapWidget.CloseNavigation, null);
    emitter.emit("pushUrl", "map")
    emitter.emit("closeNavigation")
  }

  if (data.includes("播放")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    emitter.emit("pushUrl", "music")
    emitter.emit("playMusic",
      {
        id: -1, fn: (name: string) => {
          eventMusic(MusicAction.Auto, null, `${MusicWidget.PlayMusic}_auto`, null, name);
        }
      });
  }
  if (data.includes("停止播放")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    eventMusic(MusicAction.Auto, null, `${MusicWidget.PauseMusic}_auto`, null);
    emitter.emit("pushUrl", "music")
    emitter.emit("playStop")
  }

  if (data.includes("下一首")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    emitter.emit("pushUrl", "music")
    emitter.emit("playNext", (name: string) => {
      eventMusic(MusicAction.Auto, null, `${MusicWidget.NextMusic}_auto`, null, name);
    })
  }
  if (data.includes("上一首")) {
    eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
    emitter.emit("pushUrl", "music")
    emitter.emit("playPre", (name: string) => {
      eventMusic(MusicAction.Auto, null, `${MusicWidget.NextMusic}_auto`, null, name);
    })
  }
});

function test() {
  let data = "停止导航"
  eventVoice(VoiceAction.Speech, VoiceEventKey.VoiceASR, data);
  eventNavagation(NavacationAction.Auto, null, NavagationAutoEventID.NavagationAutoMap);
  eventMap(MapAction.Auto, null, MapWidget.CloseNavigation, null);
  emitter.emit("pushUrl", "map")
  emitter.emit("closeNavigation")
}

// 禁止右键菜单
document.addEventListener('contextmenu', function (e) {
  e.preventDefault();
});
</script>

<template>
  <AppProvider>
    <div @click="test">测试</div>
    <NConfigProvider :theme-overrides="themeOverrides" class="h-full select-none">
      <div class="h-full flex flex-col">
        <div class="text-white absolute top-1px z-100 text-1.8rem left-0 right-0 w-full m-auto  text-center">
          {{ audioData }}
        </div>
        <HMI></HMI>
      </div>
    </NConfigProvider>
  </AppProvider>

</template>
